<template>
    <div class="singer-wrap">
        <mt-index-list>
            <mt-index-section index="A">
                <mt-cell title="Aaron"></mt-cell>
                <mt-cell title="Alden"></mt-cell>
                <mt-cell title="Austin"></mt-cell>
            </mt-index-section>
            <mt-index-section index="B">
                <mt-cell title="Baldwin"></mt-cell>
                <mt-cell title="Braden"></mt-cell>
            </mt-index-section>...
            <mt-index-section index="Z">
                <mt-cell title="Zack"></mt-cell>
                <mt-cell title="Zane"></mt-cell>
            </mt-index-section>
        </mt-index-list>
    </div>
</template>
<script>
import { IndexList, IndexSection, Cell } from "mint-ui";
export default {
    data() {
        return {
            
        };
    },
    mounted(){
        
    },
    components: {
        "mt-index-list": IndexList,
        "mt-index-section": IndexSection,
        "mt-cell": Cell
    }
};
</script>
<style lang="less" scoped>
.singer-wrap {
    position: relative;
    .header {
        top: 58px;
        background-color: #fff;
        color: #000;
        box-shadow: 0 0 2px 0 hsla(0, 6%, 58%, 0.6);
        -webkit-box-shadow: 0 0 2px 0 hsla(0, 6%, 58%, 0.6);
    }
}
</style>